<template>
	<!-- 全真模拟 -->
	<view class="simulation pd-30">
		<u-navbar back-icon-color="#fff" :customBack="goback" title-color="#fff" title="试卷管理" :border-bottom="false"></u-navbar>
		<view class="container">
			<view class="online-paper">
				<view class="operation">
					<view class="header fs"><text>组卷类型</text></view>
					<view class="btns">
						<view @click="createPaper(1)">
							<text class="type">一键组卷</text>
							<text class="info">自主组卷、只需一键</text>
						</view>
						<view @click="createPaper(2)">
							<text class="type">手动组卷</text>
							<text class="info">章节、题型自由设置</text>
						</view>
					</view>
				</view>
				<view class="paper-list">
					<view class="header fs">
						<text>我的试卷</text>
						<view class="titleMore" v-if="list.length" @click="readmore">
							<text>更多</text>
							<my-icon name="more-next" style="font-size:22upx;"></my-icon>
						</view>
						
					</view>
					<view class="list">
						<my-empty v-if="emptyFalse" emptyTit="暂无试卷"></my-empty>
						<my-paper-list-item
							@click.native="review(paper.paperid)"
							:item="paper"
							v-for="paper in list"
							:key="paper.paperid"
						></my-paper-list-item>
					</view>
				</view>
			</view>
		</view>
		<!-- <u-loadmore icon-type="flower" v-show="list.length || status === 'loading'" bg-color="#f5f5f5" :status="status" @loadmore="getPageData()" :margin-top="20" /> -->
	</view>
</template>

<script>
import exam from '../../mixins/exam.js';
/**
 * mode 3-全真模拟 4-组卷
 * */
export default {
	mixins: [exam],
	data() {
		return {
			moniPaper: {
				list: [],
				pageNo: 1,
				isLastPage: false
			},
			onlinePaper: [],
			status: 'loadmore',
			emptyFalse:false,
			linkType:0,//链接类型
		};
	},
	watch: {
		activeTab(newValue, oldValue) {
			!this.list.length && this.getPageData();
		},
		list(){
			this.emptyFalse=this.list.length>0?false:true;
		}
	},
	computed: {
		list() {
			 return this.moniPaper.list.length ? this.moniPaper.list : [];
		},
		isLastPage() {
			 return this.moniPaper.isLastPage;
		}
	},
	onLoad(option) {
		this.linkType=option.linkType==1?option.linkType:'';
		// this.init();
	},
	onShow() {
		if (uni.getStorageSync('chapterInfo')) {
			uni.removeStorage({
				key: 'chapterInfo'
			});
		}
		this.init()
	},
	onReachBottom() {
		!this.moniPaper.isLastPage && this.getPageData();
	},
	methods: {
		init() {
			this.moniPaper.pageNo = 1;
			this.moniPaper.list = [];
			this.moniPaper.isLastPage = false;
			this.status = 'loadmore';
			return this.getPageData();
		},
		getPageData() {
			this.status = 'loading';
			const { api, activeTab, moniPaper } = this;
			return new Promise((resolve, reject) => {
				this.request
					.post('/app/teacher/papermanage/getTeacherPaper', {
						pageNo: moniPaper.pageNo,
						pageSize:4
					})
					.then(res => {
					//模拟考试
					this.moniPaper.list = moniPaper.list.concat(res.list);
					this.moniPaper.isLastPage = res.isLastPage;
					if (res.isLastPage) this.status = 'nomore';
					else this.moniPaper.pageNo++;
						resolve();
					})
					.finally(() => {
						!this.moniPaper.isLastPage && (this.status = 'loadmore');
					});
			});
		},
		readmore() {
			uni.navigateTo({
				url: './myPaper'
			});
		},
		createPaper(type) {
			uni.navigateTo({
				url: `../createPaper/createPaper?groupType=${type}&linkType=${this.linkType}`
			});
		},
		review(paperid) {
				const apiSetting = { method: 'get', url: `/app/teacher/papermanage/getPaperQuestion/${paperid}` };
				const answerPageSetting = {
					correcting: true,
					clearHistoryHandler: 'clearPracticeHistory',
					correctTopic: true,
					initArguments: [true]
				};
				answerPageSetting.autoJump = null;
				answerPageSetting.isRecitation = true;
				answerPageSetting.clearHistory = false;
				answerPageSetting.navTitle = '试卷题目';
				answerPageSetting.updateHistoryHandler = 'updateRecitationHistory';
				this.startAnswer(apiSetting, answerPageSetting);
		},
		goback(){
			
		 if(this.linkType==1){
			 uni.navigateBack()
		 }else{
			 uni.switchTab({
			 	url:"../home/home"
			 })
		 }
			
		}
	}
};
</script>
<style>
page {
	background-color: #f5f5f5;
}
</style>
<style scoped lang="scss">
.simulation {
	display: flex;
	flex-direction: column;
	> view {
		position: relative;
	}
}
.btns {
	display: flex;
	justify-content: space-between;
	view {
		margin-top: 40upx;
		background-repeat: no-repeat;
		background-size: 100% 100%;
		background: url('../../static/online/bg-yellow.png') no-repeat center;
		background-size: 100% 100%;
		width: 330upx;
		height: 140upx;
		padding: 20upx 0;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		border-radius: 10upx;
		text {
			color: #fff !important;
		}
		padding-left: 30upx;
		.type {
			font-size: 32upx;
			line-height: 32upx;
			font-weight: 500;
		}
		.info {
			opacity: 0.8;
			font-size: 26upx;
			line-height: 26upx;
			font-weight: 400;
		}
	}
	view:first-child {
		margin-right: 30upx;
	}
	view:last-child {
		background: url('../../static/online/shoudong.png') no-repeat center;
		background-size:  100% 100%;
	}
}
/deep/.empty{
	position: relative;
	padding-bottom: 30upx;
	height: 720upx;
	image{
		margin-top: 30upx;
	}
}
.titleMore{
	display: flex;
	line-height: 36upx;
	justify-content: end;
	align-items: center;
	font-weight: 400;
	text{
		font-size: 28upx!important;
		color: #999!important;
		margin-right: 16upx;
	}
	.iconfont{
		color: #999;
		font-size: 17upx;
	}
}
.paper-list {
	padding: 40upx 0 0 0 !important;
	.header {
		display: flex;
		align-items: center;
		border-bottom: 1px solid #ebebeb;
		padding: 30upx;
		padding-top: 0;
		padding-bottom: 40upx;
		text {
			flex: 1;
			font-size: 36upx;
			font-weight: 500;
			color: #363940;
		}
	}
}
.fs{
	font-size: 36upx;
	font-weight: 500;
}
.online-paper > view {
	padding: 40upx 30upx;
	background: white;
	margin-bottom: 20upx;
	.header {
		font-size: 36upx;
		color: #363940;
	}
}
/deep/ .paper-item:last-child .box{
	border: none;
}
</style>
